<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>关联用户</title>
    <link rel="stylesheet" href="${basePath}/admin/layui/css/layui.css">
    <link rel="stylesheet" href="${basePath}/admin/css/admin.css">
		
		<script type="text/javascript">
			window.token = '${sessionScope.token}';
		</script>
</head>
<body>
<div class="layui-form">
    <div class="layui-inline">
      <%--  <label class="layui-form-label">搜索选择框</label>--%>
      <%--  <div class="layui-input-inline">
            &lt;%&ndash;<select id="userSelect" name="modules" lay-filter="userSelect" lay-search="">
                <option value="">直接选择或搜索选择</option>
            </select>&ndash;%&gt;
            <input id="userSelect" name="modules" lay-filter="userSelect" lay-search="">
        </div>--%>
        <div class="layui-input-inline">
            <input type="text" id="empName" name="empName" lay-verify="title" autocomplete="off" placeholder="请输入员工名或者工号" class="layui-input">
        </div>
        <button class="layui-btn layui-btn-sm" lay-submit lay-filter="search">搜索</button><br>
    </div>
    <div class="layui-inline" style="text-align:right;padding-top:4px;">
       <button class="layui-btn layui-btn-sm" style="width: 100px;background-color: #FFB800;" lay-submit lay-filter="bind">绑定</button><br>
        <table class="layui-hide" id="table01"
               lay-filter="table01"></table>
    </div>
</div>
</body>
<script src="${basePath}/admin/layui/layui.all.js"></script>
<script src="${basePath}/admin/js/plugin/jquery-2.2.4.min.js"></script>
<script src="${basePath}/admin/js/plugin/template-web.js"></script>
<script src="${basePath}/admin/js/mylayui.js"></script>
<script type="text/javascript">
    $(function(){
        window.basePath = '${basePath}';
        var roleId = $(parent.document.getElementById("roleId")).val();
        var table = layui.table;
        var form = layui.form;

        form.on('submit(search)', function(data) {
            getBindedOrUnbindEmployeesList(table,roleId);
        });


            form.on('submit(bind)', function(data){
            var checkStatus = table.checkStatus('table01')
                ,data = checkStatus.data;
            if(data.length == 0){
                parent.parent.layer.alert("请选择要绑定的员工！");
                return;
            }
            var idstr="";
            for(var i=0;i<data.length;i++){
                if(i==data.length-1){
                    idstr = idstr+data[i].eId;
                }else{
                    idstr = idstr+data[i].eId+",";
                }
            }
            //绑定
            $.ajax({
                url:window.basePath+  "/sys/bindEmployeeRole",
                type: "POST",
								headers: {"token" : window.token},
                dataType: 'json',
                data:{roleId:roleId,empIds:idstr},
                success: function(data) {
                    if(data.success){
                        parent.parent.layer.alert("绑定成功！");
                        //重新加载搜索下拉框
                        getBindedOrUnbindEmployeesList(table,roleId);

                        //模拟点击事件刷新右边iframe数据
                        var rightSubmitBtn = $(parent.frames["iframeContent"].document.getElementById("submitBtn"));
                        $(rightSubmitBtn).trigger("click");
                    }
                },
                error:function(){
                    parent.parent.layer.alert("操作失败");
                }
            });
        });

        //加载未绑定的用户
        getBindedOrUnbindEmployeesList(table,roleId);

    });


    function getBindedOrUnbindEmployeesList(table,roleId){
        var empName=$("#empName").val();
        $.ajax({
            url: window.basePath+ "/sys/getBindedOrUnbindEmployeesList",
            type: "POST",
						headers: {"token" : window.token},
            dataType: 'json',
            data:{roleId:roleId,type :'unbind',empName:empName},
            success: function(data) {
                loadTable(table,data);

            },
            error:function(){
                layer.alert("操作失败");
            }
        });
    }
    function loadTable(table,data1){
        var tableIns = table.render({
            elem : '#table01',
            height : 290,
            data:data1.data,
            cols : [ [{
                type : 'checkbox'
            },/*{
                type:'numbers',
                title : '序号',
                width : 50
            },*/{
                field : 'EmpName',
                width : 65,
                align : 'center',
                title : '姓名'
            },{
                field : 'EmpCode',
                width : 100,
                align : 'center',
                title : '工号'
            }] ],
            text : {
                none : '暂无相关数据' //默认：无数据。注：该属性为 layui 2.2.5 开始新增
            },
            page : false,
            done: function(res, curr, count){
            }
        });
    }
</script>
</html>